<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title>首页</title>
		<link rel="stylesheet" type="text/css" href="css/style.css" />
		<style>
			.itemChoice {
				color: #007D36;
			}

			body {
				background: white;

			}

			.botText {
				font-family: HiraginoSansGB;
				font-weight: normal;
				color: rgba(255, 255, 255, 1);
				opacity: 0.25;
				height: 1.5rem;
				line-height: 1.5rem;
			}
		</style>
	</head>
	<body>
		<!-- 最顶部 -->
		<div id="top">
			<div class="leftAndRight" id="topContent">
				<div class="divRow divColumnCenter">
					<img src="img/home1.png" />
					<span>您好，欢迎来到村里村外~</span>
				</div>
				<div class="divRow divColumnCenter">
					<a href="login.html">登录</a>
					<a class="divColumnCenter" href="register.html">
						<img src="img/home2.png" />
						<span>注册</span>
					</a>
					<a href="personal.html">个人中心</a>
					<a href="#">我们的村子</a>
					<a href="#">手机版</a>
					<a href="#">关注村子</a>
					<a class="divColumnCenter" href="#">
						<span>村委会/社区</span>
					</a>
				</div>



			</div>
		</div>
		<!-- 搜索加导航标签 -->
		<div id="head" class="divCenter">
			<div id="headContent" class="divCenter">
				<div style="width: 75rem;height: 100%;background: white;">
					<div style="width: 100%;height: 76%;" class="leftAndRight">
						<div style="width: 12.5rem;" class="divCenter">
							<img src="img/logo.png" />
						</div>
						<!-- 搜索 -->
						<div style="width:37.5rem;height: 2.5rem;" class="divRow divColumnCenter">
							<input style="width: 80%;height: 100%;" />
							<div style="width: 20%;height: 105%;background: #007D36;" class="divCenter">
								<img src="img/home3.png" />
							</div>
							<!-- g购物车 -->
							<div style="width: 8.75rem;height: 2.5rem;border: 1px solid #007D36;margin-left: 1.25rem;cursor: pointer;" class="divRow divCenter"
							 id="toCar">
								<img src="img/home4.png" />
								<span style="color: #007D36;font-size: 0.875rem;margin-left: 0.625rem;">购物车 0</span>
							</div>
						</div>

					</div>
					<!-- 顶部标题 -->
					<div style="width: 100%;height: 24%;" class="divRow divColumnCenter" id="toptab">
						<div style="width: 12.5rem;height: 100%;background: #007D36;color: white;position: relative;" class="divCenter"
						 id="home">
							<span>村里村外市场</span>
							<img src="img/home5.png" style="position: absolute;left: 0.625rem;" />
						</div>
						<div class="divRow divColumnCenter" id="topTable">
							<a href="#" v-for="(item,index) in titleList" @click="itemClik(index)">
								<h3 v-html="item.name" :class="{itemChoice:item.isChoice}"></h3>
							</a>
						</div>
					</div>
				</div>

			</div>
		</div>
		<iframe src="home.html" style="width: 100%;background: white;" frameborder="0" scrolling="no" id="external-frame"
		 onload="iFrameHeight()"></iframe>
		<div style="width: 100%;" class="divCenter">
			<div style="width: 75rem;background: white;height: 14rem;" class="divRow divCenter">
				<div style="width: 25%;" class="divRow divCenter">
					<img src="img/home13.png" />
					<span style="color: #999999;margin-left: 0.625rem;font-size: 1rem;">品类齐全 轻松购物</span>
				</div>
				<div style="width: 25%;" class="divRow divCenter">
					<img src="img/home14.png" />
					<span style="color: #999999;margin-left: 0.625rem;font-size: 1rem;">精选生鲜 严格质检</span>
				</div>
				<div style="width: 25%;" class="divRow divCenter">
					<img src="img/home15.png" />
					<span style="color: #999999;margin-left: 0.625rem;font-size: 1rem;">天天低价 畅选无忧</span>
				</div>
				<div style="width: 25%;" class="divRow divCenter">
					<img src="img/home16.png" />
					<span style="color: #999999;margin-left: 0.625rem;font-size: 1rem;">全方位 售后服务</span>
				</div>
			</div>
		</div>
		<!-- 底部介绍 -->
		<div style="width: 100%;15rem;background: #282633;height: 22.5rem;" class="divCenter">
			<div style="width: 75rem;height: 100%;" class="divColumn">
				<div style="width: 100%;height: 70%;" class="divRow">
					<div style="width: 60%;height: 100%;" class="divColumn">
						<div style="width: 100%;color: white;height: 3.25rem;" class="divRow divColumnCenter">
							<h3 style="width: 20%;;">公司介绍</h3>
							<h3 style="width: 20%;">购物指南</h3>
							<h3 style="width: 20%;">支付方式</h3>
							<h3 style="width: 20%;">售后服务</h3>
							<h3 style="width: 20%;">商家服务</h3>
						</div>
						<div style="height: 0.0625rem;background: #000000;width: 100%;"></div>
						<div style="width: 100%;margin-top: 0.875rem;" class="divRow">
							<div style="width: 20%;" class="divColumn">
								<span class="botText">关于村里村外</span>
								<span class="botText">企业荣誉</span>
								<span class="botText">战略合作</span>
								<span class="botText">媒体报道</span>
								<span class="botText">企业风采</span>
								<span class="botText">联系我们</span>
							</div>
							<div style="width: 20%;" class="divColumn">
								<span class="botText">免费注册</span>
								<span class="botText">购物流程</span>
								<span class="botText">发票制度</span>
								<span class="botText">配送说明</span>
								<span class="botText">联系客服</span>
							</div>
							<div style="width: 20%;" class="divColumn">
								<span class="botText">网上支付</span>
							</div>
							<div style="width: 20%;" class="divColumn">
								<span class="botText">验货与拒收政策</span>
								<span class="botText">退换货流程</span>
								<span class="botText">退款流程</span>
							</div>
							<div style="width: 20%;" class="divColumn">
								<span class="botText">招商范围</span>
								<span class="botText">商家资质要求</span>
								<span class="botText">入驻流程</span>
								<span class="botText">商家后台</span>
							</div>
						</div>

					</div>
					<div style="width: 40%;height: 100%;" class="divRow">
						<div style="margin: 1.25rem;">
							<img src="img/home17.png" />
						</div>
						<div style="margin:1.25rem 0rem;width: 60%;" class="divColumn">
							<span style="width: 60%;text-align: end;" class="botText">二十四小时咨询热线</span>
							<h1 style="color: white;">021-12454563</h1>
							<div class="divRow" style="margin-top: 0.625rem;">
								<div class="divColumn" style="width: 40%;" class="divColumn divCenter">
									<img src="img/home18.png" style="width: 100%;" />
									<span class="botText" style="text-align: center;">手机APP</span>
								</div>
								<div style="width: 10%;"></div>
								<div class="divColumn" style="width: 40%;" class="divColumn divCenter">
									<img src="img/home18.png" style="width: 100%;" />
									<span class="botText" style="text-align: center;">微信公众号</span>

								</div>
							</div>
						</div>
					</div>
				</div>
				<div style="width: 100%;height: 0.0625rem;background: black;"></div>
				<div style="width: 100%;margin-top: 1.25rem;" class="divColumn">
					<h2 style="color: white;">湖南村里村外电子商务有限公司</h2>
					<div class="divRow divColumnCenter" style="height: 2.625rem;">
						<span class="botText">湖南长沙市XXXXXXX栋XX单元</span>
						<span class="botText" style="margin-left: 2.5rem;">Tel:05456-46546545</span>
						<span class="botText" style="margin-left: 2.5rem;">E-mail:564564654@qq.com</span>

					</div>


				</div>

			</div>


		</div>



		<!-- 产品分类及轮播图 -->
		<script src="js/vue.min.js"></script>
		<script src="js/jquery-2.1.4.js"></script>

		<script>
			window.onload = function() {
				var iframe_obj = document.getElementById("external-frame");
			}

			function iFrameHeight() {
				var ifm = document.getElementById("external-frame");
				if (ifm) {
					if (ifm && !window.opera) {
						if (ifm.contentDocument && ifm.contentDocument.body.offsetHeight) {
							ifm.height = ifm.contentDocument.body.offsetHeight;
						} else if (ifm.Document && ifm.Document.body.scrollHeight) {
							ifm.height = ifm.Document.body.scrollHeight;
						}
						//alert(ifm.height);
						//SetTitle();
					}
				}
			}

			var toptab = new Vue({
				el: '#toptab',
				data: {
					titleList: [{
							name: '村里的货',
							isChoice: false
						},
						{
							name: '大家都在买的',
							isChoice: false
						},
						{
							name: '限时抢购',
							isChoice: false
						},
						{
							name: '家里常备农产品',
							isChoice: false
						},
						{
							name: '村里村外故事',
							isChoice: false
						},


					]
				},
				created: function() {

				},

				methods: {
					itemClik: function(index_) {
						for (var i = 0; i < toptab.titleList.length; i++) {
							if (index_ == i) {
								toptab.titleList[i].isChoice = true;
							} else {
								toptab.titleList[i].isChoice = false;
							}

						}
						switch (index_) {
							case 0:
								$('#external-frame').attr('src', 'goodList.html');


								break;
							case 1:
								$('#external-frame').attr('src', 'general_buy.html');
								break;
							case 2:
								$('#external-frame').attr('src', 'flash_sale.html');
								break;
							case 3:
								break;
							case 4:

								break;

						}








					}

				}


			});
			$('#home').click(function() {
				$('#external-frame').attr('src', 'home.html');
				for (var i = 0; i < toptab.titleList.length; i++) {
					toptab.titleList[i].isChoice = false;
				}

			});
			$('#toCar').click(function() {

				location.href = "shoppingCar.html";





			});
		</script>
	</body>
</html>
